<template>
  <div class="mod-user">
    <el-dialog
      :close-on-click-modal="false"
      :visible.sync="visible"
      width="45%">
      <el-tabs type="border-card">
        <el-tab-pane :label="!dataForm.id ? '' : '查看'">
          <el-form :inline="true" :model="dataForm" :rules="dataRule" ref="dataForm" class="data-form">
            <el-row >
              <el-form-item label="关键词:" prop="keyWord">
                <el-input v-model="dataForm.keyWord" placeholder="关键词" clearable style="width:780px"></el-input>
              </el-form-item>
            </el-row>
            <el-row>
              <el-form-item label="跳转类型:">
                <el-select v-model.trim="dataForm.jumpType" filterable placeholder="选择/搜索" @change="getUpgradeInfo(true)" style="width: 110px">
                  <el-option
                    v-for="item in options"
                    :key="item.value"
                    :label="item.label"
                    :value="item.value">
                  </el-option>
                </el-select>
              </el-form-item>
              <el-form-item label="跳转地址/ID:">
              <el-input v-model="dataForm.jumpUrl" placeholder="跳转外链"  style="width:510px"></el-input><br/>
              </el-form-item>
            </el-row>
            <el-row v-if="dataForm.jumpType == '20'">

            </el-row>
              <el-form-item label="点击量:">
                <el-input v-model="dataForm.clicks" placeholder="点击量："  style="width:123px"></el-input><br/>
              </el-form-item>
            <el-row>
              <el-form-item label="备注声明:">
                <textarea v-model="dataForm.remarks" style="width:774px; height:60px"></textarea>
              </el-form-item>
            </el-row>

            <el-row>
              <el-form-item :inline="true">
                <div align="right" style="width: 772px">
                  <el-button @click="visible = false">取消</el-button>
                </div>
              </el-form-item>
            </el-row>
          </el-form>
        </el-tab-pane>
      </el-tabs>
    </el-dialog>
  </div>
</template>

<script>
export default {
  data () {
    return {
      visible: false,
      regFlag: false,
      dataForm: {
        id: 0,
        keyWord: '',
        jumpType: '',
        remarks: '',
        jumpUrl: '',
        clicks: ''
      },
      options: []
    }
  },
  methods: {
    init (id) {
      debugger
      this.dataForm.id = (id = undefined ? 0 : id) || 0
      this.userId = ''
      this.dataForm.keyWord = ''
      this.dataForm.jumpType = ''
      this.dataForm.remarks = ''
      this.dataForm.jumpUrl = ''
      this.dataForm.clicks = ''
      this.visible = true
      this.saveJsonObject()
      this.$nextTick(() => {
        /* if (this.$refs['dataForm'] !== undefined) {
          this.$refs['dataForm'].resetFields()
        } */
        if (this.dataForm.id) {
          this.$http({
            url: this.$http.adornUrl(`/egg/getUpgradeById/${this.dataForm.id}`),
            method: 'get',
            params: this.$http.adornParams()
          }).then(({data}) => {
            if (data && data.code === 0) {
              this.dataForm.id = data.data.id
              this.dataForm.keyWord = data.data.keyWord
              this.dataForm.jumpType = data.data.jumpType + ''
              this.dataForm.jumpUrl = data.data.jumpUrl
              this.dataForm.remarks = data.data.remarks
            }
          })
        }
      })
    },
    saveJsonObject () {
      this.options = [
        {value: '0', label: '商品分类'},
        {value: '1', label: '联盟店分类'},
        {value: '2', label: '活动'},
        {value: '3', label: '外链'},
        {value: '4', label: '店铺'},
        {value: '5', label: '专题'},
        {value: '6', label: '无跳转'},
        {value: '7', label: '商品'},
        {value: '8', label: '品牌'},
        {value: '12', label: '特殊处理'},
        {value: '13', label: '分享'},
        {value: '14', label: '分类导航页'},
        {value: '17', label: '商城一级分类'},
        {value: '18', label: '采购'},
        {value: '19', label: '签到'},
        {value: '20', label: '采蛋升级'}
      ]
    }
  }
}
</script>
<style>
  .el-upload__tip {
    margin-left: 277px;
  }
</style>
